<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link href="bootstrap/css/bootstrap.min.css" rel="stylesheet">
<link href="bootstrap/css/bootstrap-responsive.min.css" rel="stylesheet"
	media="screen">
<link href="bootstrap/css/doc.css" rel="stylesheet">
<link href="bootstrap/css/prettify.css" rel="stylesheet">

<style type="text/css">
td {
	text-align: center;
}

body {
	padding-bottom: 40px;
}

.form-signin {
	max-width: 300px;
	padding: 19px 29px 29px;
	margin: 0 auto 20px;
	background-color: #fff;
	border: 1px solid #e5e5e5;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	-webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, .05);
	-moz-box-shadow: 0 1px 2px rgba(0, 0, 0, .05);
	box-shadow: 0 1px 2px rgba(0, 0, 0, .05);
	margin-top: 15%;
}

.form-signin .form-signin-heading,.form-signin .checkbox {
	margin-bottom: 10px;
}

.form-signin input[type="text"],.form-signin input[type="password"] {
	font-size: 16px;
	height: auto;
	margin-bottom: 15px;
	padding: 7px 9px;
}

.table-tete {
	background-color: #f5f5f5;
}

.button-nav {
	margin-right: 1em;
}

.login {
	float: right;
}

.form-nav {
	margin: 0;
}

.page-header h2 {
	display: inline-block;
}

.form-match {
	display: inline-block;
	margin: 0;
	margin-left: 40%;
}

.image-button {
	border: 1px solid #CECBCB;
	border-radius: 11%;
	width: 100px;
}

.image-button:hover {
	border: 2px solid black;
}

.span9 {
	margin-top: 40px;
}

.image-group-button {
	margin-bottom: 30px;
}
</style>
<title>Tournoi de foot - Admin</title>
</head>
<body>
	<title>Tounoi de foot</title>
</head>
<body data-spy="scroll" data-target=".bs-docs-sidebar">

	<!-- Navbar
    ================================================== -->
	<div class="navbar navbar-inverse navbar-fixed-top">
		<div class="navbar-inner">
			<div class="container">
				<button type="button" class="btn btn-navbar" data-toggle="collapse"
					data-target=".nav-collapse">
					<span class="icon-bar"></span> <span class="icon-bar"></span> <span
						class="icon-bar"></span>
				</button>
				<div class="nav-collapse collapse">
					<ul class="nav">
						<li class="active"><a href="admin">Accueil</a></li>
					</ul>


					<form class="form-nav" method="POST" action="admin?action=logout">
						<input type="submit" class="btn btn-danger login" value="Log out" />
					</form>


				</div>
			</div>

		</div>
	</div>
	<!--  ==================================================  Navbar -->

	<!-- Subhead
================================================== -->


	<c:set var="match" value="${sessionScope.match}" />


	<header class="jumbotron subhead" id="overview">
	<div class="container">
		<c:if test="${match.isEnCours()}">
			<h2>
				Match du
				<c:out value="${match.dateHeure.substring(8,10)}" />
				/
				<c:out value="${match.dateHeure.substring(5,7)}" />
				/
				<c:out value="${match.dateHeure.substring(0,4)}" />
				à
				<c:out
					value="${match.dateHeure.substring(10,match.dateHeure.length() -3)}" />
			</h2>
		</c:if>

		<h1>
			<a href="index?action=equipe&id=${match.domicile.id}">${match.domicile.nom}</a>
			<c:out
				value="${match.scoreEquipe(match.domicile) - match.scoreEquipeTirAuBut(match.domicile)}" />
			-
			<c:out
				value="${match.scoreEquipe(match.exterieur) - match.scoreEquipeTirAuBut(match.exterieur)}" />
			<a href="index?action=equipe&id=${match.exterieur.id}">${match.exterieur.nom}</a>
		</h1>
		<p class="lead">
			Match
			<c:out value="${match.afficherEtat()}" />
			<c:if test="${!match.isPrevu()}">
			-
			<c:out value="${match.afficherMomentMatch()}" />
				<c:if test="${match.tirAuButs}">
					<c:out value="${match.scoreEquipeTirAuBut(match.domicile)}" /> - <c:out
						value="${match.scoreEquipeTirAuBut(match.exterieur)}" />
				</c:if>
			</c:if>
		</p>

		<div class="progress progress-success progress-striped active">
			<div class="bar" style="width: ${match.pourcentageBar()}%;"></div>
		</div>


		<div id="carbonads-container"></div>
	</div>
	</header>


	<div class="container">
		<div class="span9">


			<div class="image-group-button">

				<a href="admin"> <img class="image-button"
					src="images/homeblanc.png" />
				</a> <a href="admin?action=inscrire-arbitres"> <img
					class="image-button" src="images/sifflet.png" />
				</a> <a href="admin?action=affecter-arbitres"> <img
					class="image-button" src="images/arbitre.png" />
				</a> <a href="admin?action=gerer-matchs"> <img class="image-button"
					src="images/gestionmatch.png" />
				</a>
			</div>

			<c:if test="${match.arbitre == null }">
			Le match ne pourra debuter tant qu'un arbitre ne sera affecté
			</c:if>

			<c:if test="${match.arbitre != null }">
				<h2>
					Arbitre du match :
					<c:out value="${match.arbitre.prenom}" />
					<c:out value="${match.arbitre.nom}" />
				</h2>

				<c:if test="${match.isPrevu()}">
					<form method="POST">
						<input type="hidden" name="action" value="gerer-match" /> <input
							type="hidden" name="action-match" value="debuter" /> <input
							type="hidden" name="id" value="${match.id}" /> <input
							type="date" id="date_debut" name="date_debut" required /> <input
							type="time" id="heure_debut" name="heure_debut" value="20:00:00"
							required /> <br /> <input type="submit" class="btn btn-success"
							value="Débuter le match" />
					</form>
				</c:if>
				<c:if test="${match.buts.size() > 0}">
					<h1>Listes des buts</h1>
					<c:forEach var="but" items="${match.buts}">

						<c:out value="${but.buteur.prenom}" />
						<c:out value="${but.buteur.nom}" />
						marque a la
						<c:out value="${but.minuteMarque}" /> eme minutes 
						<c:out value="${but.afficherTypeBut()}" />
						<br />
					</c:forEach>
				</c:if>
				<c:if test="${match.isEnCours()}">
					<form method="POST">
						<input type="hidden" name="action" value="gerer-match" /> <input
							type="hidden" name="action-match" value="ajouter-but" /> <input
							type="hidden" name="id" value="${match.id}" />

						<h1>Ajouter un but</h1>

						Equipe :<br /> <select id="equipe" name="equipe">
							<option selected value="${match.domicile.id}"><c:out
									value="${match.domicile.nom}" /></option>
							<option value="${match.exterieur.id}"><c:out
									value="${match.exterieur.nom}" /></option>
						</select> <select id="joueur" name="joueur">


						</select>
						<c:if test="${!match.tirAuButs}">
							<br /> But à la :<br />
							<input type="number" name="minute" min="${match.minuteJoue}"
								max="140" value="${match.minuteJoue}" required />
							<br />
						</c:if>

						<c:if test="${match.tirAuButs}">
							<input type="hidden" name="minute" value="120" />
						</c:if>
						<c:choose>
							<c:when test="${match.isReglementaire()}">
								<input type="hidden" name="typebut" value="0" />
							</c:when>

							<c:when test="${match.prolongation}">
								<input type="hidden" name="typebut" value="1" />
							</c:when>

							<c:when test="${match.tirAuButs}">
								<input type="hidden" name="typebut" value="2" />
							</c:when>

						</c:choose>

						<input type="submit" class="btn btn-success"
							value="Ajouter un but" />

					</form>

					<c:if test="${!match.tirAuButs && match.minuteJoue < 140}">

						<form method="POST">
							<input type="hidden" name="action" value="gerer-match" /> <input
								type="hidden" name="action-match" value="avancer-match" /> <input
								type="hidden" name="id" value="${match.id}" />

							<h1>Avancer le match</h1>



							<br />Minute de jeu du match:<br /> <input type="number"
								name="minute" min="${match.minuteJoue}" max="140"
								value="${match.minuteJoue}" required /> <br /> <input
								type="submit" class="btn btn-success" value="Avancer" />
						</form>
					</c:if>

					<form method="POST">
						<input type="hidden" name="action" value="gerer-match" /> <input
							type="hidden" name="id" value="${match.id}" />
						<c:if test="${match.isReglementaire()}">
							<c:if
								test="${match.scoreEquipe(match.exterieur) == match.scoreEquipe(match.domicile)}">
								<input type="hidden" name="action-match" value="prolongation" />
								<input type="submit" class="btn btn-danger"
									value="Débuter prolongation" />
							</c:if>
						</c:if>

						<c:if test="${match.prolongation}">
							<c:if
								test="${match.scoreEquipe(match.exterieur) == match.scoreEquipe(match.domicile)}">
								<input type="hidden" name="action-match" value="tiraubut" />
								<input type="submit" class="btn btn-danger"
									value="Débuter Tirs aux buts" />
							</c:if>
						</c:if>
					</form>

					<c:if
						test="${match.scoreEquipe(match.exterieur) != match.scoreEquipe(match.domicile)}">
						<form method="POST">

							<input type="hidden" name="action" value="gerer-match" /> <input
								type="hidden" name="action-match" value="finir" /> <input
								type="hidden" name="id" value="${match.id}" /> <input
								type="submit" class="btn btn-inverse" value="Finir le match" />
						</form>

					</c:if>
				</c:if>

				<c:if test="${match.isFinit()}">
				</c:if>

			</c:if>
		</div>
	</div>



	<!-- Footer
    ================================================== -->
	<footer class="footer">
	<div class="container">
		<p>Designed and built by Kévin De Jesus Ferreira, Florent
			Champigny & Julien Mialon</p>
		<p>Projet Etudes AAR - Master 2 Informatique Orléans</p>
	</div>
	</footer>
	<!--  ==================================================  Footer -->
</body>
<!-- Le javascript
    ================================================== -->
<!-- Placed at the end of the document so the pages load faster -->
<script type="text/javascript"
	src="http://platform.twitter.com/widgets.js"></script>
<script src="bootstrap/js/jquery.js"></script>
<script src="bootstrap/js/bootstrap.min.js"></script>
<script src="bootstrap/js/bootstrap-transition.js"></script>
<script src="bootstrap/js/bootstrap-alert.js"></script>
<script src="bootstrap/js/bootstrap-modal.js"></script>
<script src="bootstrap/js/bootstrap-dropdown.js"></script>
<script src="bootstrap/js/bootstrap-scrollspy.js"></script>
<script src="bootstrap/js/bootstrap-tab.js"></script>
<script src="bootstrap/js/bootstrap-tooltip.js"></script>
<script src="bootstrap/js/bootstrap-popover.js"></script>
<script src="bootstrap/js/bootstrap-button.js"></script>
<script src="bootstrap/js/bootstrap-carousel.js"></script>
<script src="bootstrap/js/bootstrap-typeahead.js"></script>
<script src="bootstrap/js/bootstrap-affix.js"></script>

<script src="bootstrap/js/holder.js"></script>

<script src="bootstrap/js/application.js"></script>
<script type="text/javascript">
	var id_domicile = <c:out value="${match.domicile.id}"/>;
	var options_domicile = "";
	<c:forEach var="joueur" items="${match.domicile.listeJoueurs}">
	options_domicile += '<option value="${joueur.id}"><c:out value="${joueur.nom}"/> <c:out value="${joueur.prenom}"/></option>';
	</c:forEach>

	var id_exterieur = <c:out value="${match.exterieur.id}"/>;
	var options_exterieur = "";
	<c:forEach var="joueur" items="${match.exterieur.listeJoueurs}">
	options_exterieur += '<option value="${joueur.id}"><c:out value="${joueur.nom}"/> <c:out value="${joueur.prenom}"/></option>';
	</c:forEach>

	$("#equipe").change(function() {
		var id_equipe = $(this).val();

		if (id_equipe == id_domicile)
			$("#joueur").html(options_domicile);
		else if (id_equipe == id_exterieur)
			$("#joueur").html(options_exterieur);

	});

	$("#joueur").html(options_domicile);

	$("#date_debut").val(new Date().toJSON().slice(0, 10));
	$("#heure_debut").val(
			new Date().getHours() + ":" + new Date().getMinutes() + ":00");
</script>
</html>